<div class="row">
    <div class="col-xs-12 col-sm-6">
        <div class="box">
            <div class="box-header">
                <div class="box-name">
                    <i class="fa fa-info"></i>
                    <span></span>
                </div>
                <div class="box-icons pull-right">
                    <a class="expand-link">
                        <i class="fa fa-expand"></i>
                    </a>
                </div>
                <div class="no-move"></div>
            </div>
            <div class="box-content">
                <h5><?php echo $product_serialize->ItemAttributes->Title ?></h5>
                <img src="<?php echo $product_serialize->MediumImage->URL ?>"/>
                <?php if ($product_serialize->ItemAttributes->Feature): ?>
                    <h4><code>Feature</code></h4>
                    <?php if (is_array($product_serialize->ItemAttributes->Feature)): ?>
                        <ul>
                            <?php foreach ($product_serialize->ItemAttributes->Feature as $featute): ?>
                                <li><?php echo $featute ?></li>
                            <?php endforeach; ?>
                        </ul>
                    <?php else: ?>
                        <?php echo $product_serialize->ItemAttributes->Feature ?>
                    <?php endif; ?>
                <?php endif; ?>
                <?php if ($product_serialize->ItemAttributes->Warranty): ?>
                    <h4><code>Warranty</code></h4>
                    <?php echo $product_serialize->ItemAttributes->Warranty ?>
                <?php endif; ?>
                <table class="beauty-table">
                    <tr>
                        <td style="width:50%;border-right:1px solid #ccc" class="text-center"><h4><code>Buy This Item
                                    Today</code></h4></td>
                        <td style="width:50%" class="text-center"><h4><code>Wait For A Price Drop</code></h4></td>
                    </tr>
                    <tr>
                        <td style="width:50%;border-right:1px solid #ccc" class="text-center">
                            <h2><?php echo $product_serialize->Offers->Offer->OfferListing->Price->FormattedPrice ?></h2>
                            <p class="small">Compare to <span style="text-decoration: line-through"><?php echo $product_serialize->ItemAttributes->ListPrice->FormattedPrice ?></span></p>
                        </td>
                        <td class="text-center"><p style="padding: 5px">Add a price alert and we'll email you when this goes on sale!</p></td>
                    </tr>
                    <tr>
                        <td style="width:50%;border-right:1px solid #ccc" class="text-center">
                            <button onclick="goBuy('<?php echo $product_object->asin ?>')" type="button" class="btn btn-success">Buy at Amazon</button>
                        </td>
                        <td class="text-center">
                            <button type="button" class="btn btn-info">Add Price Alert</button>
                        </td>
                    </tr>
                </table>
                <p class="small"><i class="fa fa-info-circle"></i> last updated price: <?php echo date("d F Y h:i:s", $product_object->updated_time) ?></p>
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-sm-6">
        <div class="box">
            <div class="box-header">
                <div class="box-name">
                    <i class="fa fa-info"></i>
                    <span>Fit Tables</span>
                </div>
                <div class="box-icons pull-right">
                    <a class="expand-link">
                        <i class="fa fa-expand"></i>
                    </a>
                </div>
                <div class="no-move"></div>
            </div>
            <div class="box-content">
                <div id="tabs">
                    <ul>
                        <li><a onclick="setCookie('active_tab',0)" href="#tabs-2010">2010</a></li>
                        <li><a onclick="setCookie('active_tab',1)" href="#tabs-2011">2011</a></li>
                        <li><a onclick="setCookie('active_tab',2)" href="#tabs-2012">2012</a></li>
                        <li><a onclick="setCookie('active_tab',3)" href="#tabs-2013">2013</a></li>
                        <li><a onclick="setCookie('active_tab',4)" href="#tabs-2014">2014</a></li>
                        <li><a onclick="setCookie('active_tab',5)" href="#tabs-2015">2015</a></li>
                    </ul>
                    <?php echo $FitTablesHtml ?>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-xs-12">
        <div class="box">
            <div class="box-header">
                <div class="box-name">
                    <i class="fa fa-usd"></i>
                    <span>3rd's offers listing</span>
                </div>
                <div class="box-icons">
                    <a class="expand-link">
                        <i class="fa fa-expand"></i>
                    </a>
                </div>
                <div class="no-move"></div>
            </div>
            <div class="box-content no-padding">
                <?php echo $OfferTableHtml ?>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    function setCookie(cname, cvalue) {
        var d = new Date();
        d.setTime(d.getTime() + (60 * 24 * 60 * 60 * 1000));
        var expires = "expires=" + d.toUTCString();
        document.cookie = cname + "=" + cvalue + "; " + expires;
    }

    function getCookie(cname) {
        var name = cname + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
            var c = ca[i];
            while (c.charAt(0) == ' ') c = c.substring(1);
            if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
        }
        return "";
    }
    function OfferTable() {
        $('#offer-table').dataTable({
            "aaSorting": [[1, "asc"]],
            "sDom": "<'box-content'<'col-sm-6'f><'col-sm-6 text-right'l><'clearfix'>>rt<'box-content'<'col-sm-6'i><'col-sm-6 text-right'p><'clearfix'>>",
            "sPaginationType": "bootstrap"
        });
    }
    function goBuy(asin) {
        var url = 'http://www.amazon.com/dp/' + asin + '/?tag=bestchoiceever-20';
        var win = window.open(url, '_blank');
        win.focus();
    }
    $(document).ready(function () {
        OfferTable();
        // Create jQuery-UI tabs
        var active_tab = getCookie("active_tab");
        if (active_tab != "") {
            $("#tabs").tabs({active: active_tab});
        } else {
            $("#tabs").tabs();
        }
    });
</script>